
<script setup>
import { computed } from 'vue'

const props = defineProps({
  score: Number,
  nextPiece: Object,
  isPaused: Boolean,
  isGameOver: Boolean
})

const emit = defineEmits(['start', 'pause', 'reset'])
</script>

<template>
  <div class="side-panel">
    <div class="next-piece">
      <h3>下一个</h3>
      <div class="preview">
        <!-- 下一个方块预览 -->
      </div>
    </div>
    <div class="score">分数: {{ score }}</div>
    <div class="controls">
      <button @click="emit('start')" v-if="!isPaused && !isGameOver">开始</button>
      <button @click="emit('pause')" v-if="isPaused && !isGameOver">继续</button>
      <button @click="emit('reset')" v-if="isGameOver">重玩</button>
    </div>
  </div>
</template>
